<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			function a(id){
				return document.getElementById(id);
			}
			window.onload = function(){
				var cnv = a("canvas");
				var cxt = cnv.getContext("2d");
				r=10;
				var n0 = [
				[1,1,1,1,1,1,1],
				[1,1,1,1,1,1,1],
				[1,1,0,0,0,1,1],
				[1,1,0,0,0,1,1],
				[1,1,1,1,1,1,1],
				[1,1,0,0,0,1,1],
				[1,1,0,0,0,1,1],
				[1,1,0,0,0,1,1],
				[1,1,1,1,1,1,1],
				[1,1,1,1,1,1,1],
				]
				for(i=0;i<10;i++){
					for(j=0;j<7;j++){
						if(n0[i][j]==1){
						cxt .beginPath();
						cxt.fillStyle = "orangered"
						cxt.arc(50+2*r*j,50+2*r*i,r,0,2*Math.PI);
						cxt.fill();
						cxt.closePath();
						}
					}
				}
				
			}
		</script>
	</head>
	<body>
		<canvas id="canvas" width="2000" height="1500" style="border: 1px solid silver;"></canvas>
	</body>
</html>